import 'package:card_swiper/card_swiper.dart';
import 'package:city_pickers/city_pickers.dart';
import 'package:city_pickers/modal/result.dart';
import 'package:easy_refresh/easy_refresh.dart';
import 'package:fluro/fluro.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_switch/flutter_switch.dart';
import 'package:shenfuhui/config/config.dart';
import 'package:shenfuhui/views/search_appbar.dart';

import '../routers/routers.dart';
import '../views/dialog_manager.dart';

///
/// 店铺主页的第一分页
///
class MallHomeIndexPage extends StatefulWidget {
  const MallHomeIndexPage({Key? key}) : super(key: key);

  @override
  State<MallHomeIndexPage> createState() => _MallHomeIndexPageState();
}

class _MallHomeIndexPageState extends State<MallHomeIndexPage> {
  var imgs = [
    'https://img.zcool.cn/community/013bbc59f56759a801202b0ca4a6c8.jpg?x-oss-process=image/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100',
    'https://img.zcool.cn/community/019b5d570b1ec76ac7251f0533d471.png@1280w_1l_2o_100sh.png',
    'https://img.zcool.cn/community/01abc85a9e162aa801219586dc141c.jpg@1280w_1l_2o_100sh.jpg'
  ];

  //返回商品列表item
  getListItem(int index) {
    return Container(
      height: 180.w,
      margin: EdgeInsets.symmetric(horizontal: 5.w, vertical: 0.w),
      decoration: BoxDecoration(
        border: Border(
          bottom: BorderSide(color: Config.colorDivider, width: 2.w),
        ),
      ),
      child: InkWell(
        onTap: () {
          Routes.navigateTo(context, Routes.productDetail,
              params: {'productId': '001'});
        },
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Container(
              margin: EdgeInsets.only(left: 20.w, right: 20.w),
              child: ClipRRect(
                borderRadius: BorderRadius.circular(5),
                child: Image.network(
                  "https://pic1.zhimg.com/v2-6438843a4cbae9184b935a75a5059ac6_1440w.jpg?source=172ae18b",
                  fit: BoxFit.fill,
                  width: 140.w,
                  height: 140.w,
                ),
              ),
            ),
            Container(
              height: 140.w,
              width: 480.w,
              child: Stack(
                children: [
                  Text(
                    "商品名称商品名称",
                    softWrap: true,
                    maxLines: 2,
                    overflow: TextOverflow.ellipsis,
                    style:
                        TextStyle(color: (Config.colorText1), fontSize: 22.w),
                  ),
                  Positioned(
                    bottom: 32.w,
                    child: Text(
                      "已售 999",
                      style:
                          TextStyle(fontSize: 20.sp, color: Config.colorText1),
                    ),
                  ),
                  Positioned(
                    bottom: 0.w,
                    child: Text(
                      "￥0.00",
                      style: TextStyle(fontSize: 20.sp, color: Colors.red),
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Config.colorBg2,
      body: Container(
        width: double.infinity,
        height: double.infinity,
        decoration: BoxDecoration(
          color: Config.colorWhite,
          borderRadius: BorderRadius.circular(12.w),
        ),
        child: EasyRefresh.builder(
          header: const MaterialHeader(),
          footer: const MaterialFooter(),
          onRefresh: () async {
            await Future.delayed(const Duration(seconds: 1), () {
              print('refresh');
            });
          },
          onLoad: () async {
            await Future.delayed(const Duration(seconds: 1), () {
              print('load');
            });
          },
          childBuilder: (context, physics) {
            return ListView(
              scrollDirection: Axis.vertical,
              physics: physics,
              children: [
                SizedBox(
                  //轮播
                  height: 240.w,
                  child: Swiper(
                    itemBuilder: (BuildContext context, int index) {
                      return ClipRRect(
                        borderRadius: BorderRadius.only(
                          topLeft: Radius.circular(12.w),
                          topRight: Radius.circular(12.w),
                        ),
                        child: Image.network(
                          imgs[index],
                          fit: BoxFit.fill,
                          width: double.infinity,
                          height: double.infinity,
                        ),
                      );
                    },
                    onTap: (index) {},
                    autoplay: true,
                    layout: SwiperLayout.DEFAULT,
                    itemCount: imgs.length,
                    // viewportFraction: 0.7,
                    // scale: 0.8,
                    pagination: SwiperPagination(
                      builder: DotSwiperPaginationBuilder(
                          // size: Size(20.w, 4.w),
                          // activeSize: Size(20.w, 4.w),
                          size: 15.w,
                          activeSize: 15.w,
                          activeColor: Config.colorMain,
                          color: Config.colorWhite),
                    ),
                  ),
                ),
                Container(
                  height: 80.w,
                  margin: EdgeInsets.only(top: 0.w),
                  decoration: BoxDecoration(
                    border: Border(
                      bottom:
                          BorderSide(color: Config.colorDivider, width: 2.w),
                    ),
                  ),
                  width: double.infinity,
                  padding: EdgeInsets.symmetric(horizontal: 30.w),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      InkWell(
                        onTap: () {},
                        child: Text(
                          '热卖专区',
                          style: TextStyle(
                              fontSize: 25.sp, color: Config.colorText1),
                        ),
                      ),
                    ],
                  ),
                ),
                Column(
                  children: [
                    ListView.builder(
                      itemCount: 10,
                      shrinkWrap: true,
                      scrollDirection: Axis.vertical,
                      physics: const NeverScrollableScrollPhysics(),
                      itemBuilder: (BuildContext context, int index) {
                        return getListItem(index);
                      },
                    ),
                  ],
                ),
              ],
            );
          },
        ),
      ),
    );
  }
}
